<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/welcome' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>商品管理</el-breadcrumb-item>
      <el-breadcrumb-item>添加商品</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="card">
      <e-card>
        <div class="row">
          <el-alert
              title="添加商品信息"
              type="info"
              show-icon
              center>
          </el-alert>
        </div>
        <el-steps :active="active" finish-status="success" style="width: 90%;margin-top: 20px;margin-left: 50px" :align-center="true" >
          <el-step title="基本信息"></el-step>
          <el-step title="商品参数"></el-step>
          <el-step title="商品属性"></el-step>
          <el-step title="商品图片"></el-step>
          <el-step title="商品内容"></el-step>
          <el-step title="完成"></el-step>
        </el-steps>
        <el-tabs tab-position="left"  style="margin-top: 50px">
          <el-tab-pane label="用户管理">用户管理</el-tab-pane>
          <el-tab-pane label="配置管理">配置管理</el-tab-pane>
          <el-tab-pane label="角色管理">角色管理</el-tab-pane>
          <el-tab-pane label="定时任务补偿">定时任务补偿</el-tab-pane>
        </el-tabs>
        <el-form>

        </el-form>
      </e-card>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style scoped>
.card {
  width: 100%;
  margin-top: 20px;
  background-color: #fff;
  height: 500px;
}
.row{
  width: 90%;
  margin-left: 50px;
}
</style>